<template>
    <page-view>
        <page-header title="编辑地址信息" showBack="true" ></page-header>
        <div >
                <address-edit
                    :area-list="areaList"
                    :area-columns-placeholder="['请选择', '请选择', '请选择']"
                    @save="onSave"
                    :is-saving="isloading"
                    >
                    <field v-model="tag" label="标签" placeholder="设定标签" > </field>
                   <!-- <tag color="#ffe1e1" text-color="#ad0000">标签</tag> -->
                    </address-edit>
            </div>
    </page-view>
</template>

<script>
import { AddressEdit,Field,Tag,Toast } from 'vant';
import { reactive,toRefs,} from 'vue';
import api from '../utils/api';
import { useRouter,useRoute } from 'vue-router';
export default {
    components:{AddressEdit,Field,Tag},
    setup () {
        const router=useRouter()
        const route=useRoute()
        let info=reactive({
       areaList:{},
       isloading:false,
       tag:'',
       editList:[]
   })

       
        const getAreaList=async()=>{ 
        let result=await api.area.getAreaList()
        info.areaList=result
        // console.log(info.areaList)

        // console.log(route.query,41)

        } 
         getAreaList()
        const findById=async()=>{
            let results=await api.addressInfo.findById({id:route.query.id})
            console.log(results)
        }
        findById()

        const onSave = async(content) => {
            if(info.isloading){
                return
            }
            info.isloading=true;
            let addressInfo={
                address:[content.province,content.city,content.county,content.addressDetail].join(),
                phone:content.tel,
                person_name:content.name,
                tag:info.tag
            }

            // let result=await api.addressInfo.addAddress(addressInfo)

            console.log(result)

            console.log(content)
            Toast('提交成功')
            info.isloading=false
            };

        return {
        onSave,
       ...toRefs(info)
        };
    }
}
</script>

<style lang="scss" scoped>

</style>